import { createRouter, 
         createWebHistory,
        //  createWebHashHistory
       } from 'vue-router'
import { useUserStore } from '@/stores'

// createRouter 创建路由实例
const router = createRouter({
  // createWebHistory 就是 history 模式 - 地址栏不带 #
  // createWebHashHisttory 是 hash 模式 - 地址栏带 #
  // 参数是基础路径，默认是 / 代表了访问路径的前缀
  // vite 中的环境变量 - import.meta.env.BASE_URL
  // 在 vite.config.js 中可以通过设置 base 配置项修改
  history: createWebHistory(import.meta.env.BASE_URL),
  // history: createWebHashHistory(import.meta.env.BASE_URL),
  // history: createWebHistory('/jd'),
  routes: [
    { path: '/login', component: () => import('@/views/login/LoginPage.vue') }, // 登录页
    {
      path: '/',
      component: () => import('@/views/layout/LayoutContainer.vue'),
      redirect: '/article/manage',
      children: [
        { path: '/article/manage', component: () => import('@/views/article/ArticleManage.vue') },
        { path: '/article/channel', component: () => import('@/views/article/ArticleChannel.vue') },
        { path: '/user/profile', component: () => import('@/views/user/UserProfile.vue') },
        { path: '/user/avatar', component: () => import('@/views/user/UserAvatar.vue') },
        { path: '/user/password', component: () => import('@/views/user/UserPassword.vue') }
      ]
    }
  ],
})

// 登录访问拦截 - 只有登录了才能进入某些页面 - 默认是直接放行的
// v3中，只有 to 和 form ，没有 next ，有 return
// 根据返回值决定,是放行还是拦截
// return 返回值：
// 1. undefined / true 直接放行 - undefined 即什么都不写
// 2. false - 取消当前导航，回到上一级，即拦回到 from 的地址页面
// 3. 具体路径 或 路径对象 - 拦截到对应的地址
//    '/login'   { name: 'login' }
router.beforeEach((to) => {
  // 如果没有 token ，且访问的是非登录页面，拦截到登录
  const userStore = useUserStore()
  if (!userStore.token && to.path !== '/login') return '/login'
  // 可不写 return true
  return true
})

export default router
